<!DOCTYPE html>
<html lang="en"  xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="./axios.min.js"></script>
	<script src="https://cdn.bootcdn.net/ajax/libs/vue-resource/1.5.1/vue-resource.min.js"></script>
    <script src="https://ssl.captcha.qq.com/TCaptcha.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/ant-design-vue@1.4.10/dist/antd.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.js"></script>
	<link href="https://cdn.jsdelivr.net/npm/ant-design-vue@1.4.10/dist/antd.min.css" rel="stylesheet" type="text/css" />
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>	
	<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
	<style type="text/css">
		#components-layout-demo-top-side-2 .logo {
		  width: 120px;
		  height: 31px;
		  background: rgba(255, 255, 255, 0.2);
		  margin: 16px 28px 16px 0;
		  float: left;
		}
		.ant-dropdown-link{
			float:right;
			margin-right:80px;
		}
		#test{
			display:none;
			height:600px;
			width:500px;
			position:absolute;
			top:12%;
			left:30%;
		}
		.notclick {
			pointer-events: none;
			opacity:0.4;
		}
	</style>
</head>
<body>
<div id="app">
<div id="user">
	<a-layout id="components-layout-demo-top-side-2">
    <a-layout-header class="header">
    
	<a-dropdown :trigger="['click']">
    <a class="ant-dropdown-link" @click="e => e.preventDefault()">
      {{name}} <a-icon type="down" />
    </a>
	
    <a-menu slot="overlay">
		<a-menu-item key="1">
			<span @click="update">修改密码</span>
		</a-menu-item>
		<a-menu-item key="2">
			<span @click="logout">退出登录</span>
		</a-menu-item>
		<a-menu-divider />
    </a-menu>
  </a-dropdown>
	<img style="height:50px;" class="logo" src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1592721080850&di=6ddb54e78cf473fd61392c73dcbe7165&imgtype=0&src=http%3A%2F%2Ffile.digitaling.com%2FeImg%2Fuimages%2F20160411%2F1460368817941866.gif">
    
      <a-menu
        theme="dark"
        mode="horizontal"
        :default-selected-keys="['2']"
        :style="{ lineHeight: '64px' }"
      >
		
        
      </a-menu>
    </a-layout-header>
	
    <a-layout>
      <a-layout-sider width="200" style="background: #fff">
        <a-menu
          mode="inline"
          :default-selected-keys="['1']"
          :default-open-keys="['sub1']"
          :style="{ height: '100%', borderRight: 0 }"
        >
          <a-sub-menu key="sub1">
            <span slot="title"><a-icon type="user"></a-icon>账号管理</span>
            <a-menu-item key="1" @click='check'>
              检查人员账号
            </a-menu-item>
            <a-menu-item key="2" @click='user'>
              住户账号
            </a-menu-item>
          </a-sub-menu>
          <a-sub-menu>
            <span slot="title"><a-icon type="laptop"></a-icon>统计</span>
			<a-menu-item key="3" @click='sta'>
              数据统计
            </a-menu-item>
			<a-menu-item key="4" @click='warn'>
              预警统计
            </a-menu-item>
		  </a-sub-menu>
        </a-menu>
      </a-layout-sider>
      <a-layout style="padding: 0 24px 24px">
        <a-breadcrumb style="margin: 16px 0">
          <a-breadcrumb-item>Home</a-breadcrumb-item>
          <a-breadcrumb-item>List</a-breadcrumb-item>
          <a-breadcrumb-item>App</a-breadcrumb-item>
        </a-breadcrumb>
        <a-layout-content
          :style="{ background: '#fff', padding: '24px', margin: 0, minHeight: '280px' }"
        >	
			<iframe src="CheckUser.html" id="CheckUser" name="iframepage" frameBorder=0 height="1500px" width="100%" ></iframe>
			
		</a-layout-content>
      </a-layout>
    </a-layout>
  </a-layout>
  </div>
  <div id="test">
	<div style="position:absolute;top:5%;right:5%;">
		<a @click="close"><a-icon type="close" /></a>
	</div>
	<iframe src="updatePassword.html" id="update" name="update" frameBorder=1 scrolling=no height="550px" width="500px" ></iframe>
  </div>
</div>
<script>
    var app = new Vue({
        // e1: '#app',
        //注意这时l来着l
        el: '#app',
        data() {
			return {
				collapsed: false,
				name: "",
				com:[],
			};
		},
		mounted(){
			this.name=this.readCookie("name");
			this.filter();
		},
		methods: {
			close(){
				$("#test").hide("slow");
				$("#user").removeClass("notclick");
			},
			filter(){
				if(this.name==""){
					this.$message.error("您未登录，或者登录过期！！！请前往登录！！！");
					window.location.href="index.html";
				}
			},
			
			logout(){
				this.createCookie("name","",-1);
				this.createCookie("id","",-1);
				axios.get("http://47.94.215.148:8080/admin/logout").then(res=>{
					this.$message.success("退出成功！！！");
					window.location.href="index.html";
				})
			},
			check(){
				var element=document.getElementById("CheckUser");
				element.src="CheckUser.html";
			},
			user(){
				var element=document.getElementById("CheckUser");
				element.src="User.html";
			},
			sta(){
				var element=document.getElementById("CheckUser");
				element.src="data.html";
			},
			warn(){
				var element=document.getElementById("CheckUser");
				element.src="warn.html";
			},
			update(){
				$("#test").show("slow");
				$("#user").addClass("notclick");
			},
			createCookie:function(name,value,days){
				var expires="";
				if(days){
					var date = new Date();
					date.setTime(date.getTime()+(days*24*60*60*1000));
					expires="; expires="+date.toGMTString();
				}
				document.cookie=name+"="+value+expires+"; path=/";
			},
			readCookie:function(name){
				var nameEQ=name + "=";
				var ca = document.cookie.split(';');
				for(var i=0;i<ca.length;i++){
					var c=ca[i];
					while(c.charAt(0)==' ')c=c.substring(1,c.length);
					if(c.indexOf(nameEQ)==0)
						return c.substring(nameEQ.length,c.length);
				}
				return "";
			},
			
		},
	})
</script>
</body>
</html>